import { createBrowserRouter, Navigate } from 'react-router-dom'
import React, { Suspense, lazy } from 'react';
// login 和 register 采用SSR，其他页面采用懒加载
import { MemoLogin } from '@/views/Login';
import { MemoRegister } from '@/views/Register';
const MemoHome = lazy(() => import('@/views/Home').then(module => ({ default: module.MemoHome })));
const MemoNotFound = lazy(() => import('@/views/NotFound').then(module => ({ default: module.MemoNotFound })));
const MemoFileList = lazy(() => import('@/views/FileList').then(module => ({ default: module.MemoFileList })));

const MemoContent = lazy(() => import('@/views/Content').then(module => ({ default: module.MemoContent })));
// const MemoExcel = lazy(() => import('@/views/Excel').then(module => ({ default: module.MemoExcel })));
const MemoAddContent = lazy(() => import('@/views/AddContent').then(module => ({ default: module.MemoAddContent })));
const MemoAddExcel = lazy(() => import('@/views/AddExcel').then(module => ({ default: module.MemoAddExcel })));
const MemoExcelList = lazy(() => import('@/views/Excel/pages/list/index.jsx').then(module => ({ default: module.MemoExcelList })));
const MemoExcelDetail = lazy(() => import('@/views/Excel/pages/detail/index.jsx').then(module => ({ default: module.MemoExcel })));

import DocListRoutes from '@/views/DocList/pages/route';
import KnowledgeBaseRoutes from '@/views/KnowledgeBase/pages/route';

const SuspenseWrapper = (element) => (
  <Suspense fallback={<div style={{textAlign:'center',marginTop:100}}>页面加载中...</div>}>
    {element}
  </Suspense>
);

const router = createBrowserRouter([
    {
        path: '/',
        element: <Navigate replace to='/home' />
    },
    {
        path: '/login',
        element: <MemoLogin />
    },
    {
        path: '/register',
        element: <MemoRegister />
      },
    {
        path: 'home',
        element: SuspenseWrapper(<MemoHome />),
        children: [
            {
                index: true,
                element: SuspenseWrapper(<MemoFileList />)
            },
            {
                path: 'list/:id',
                element: SuspenseWrapper(<MemoFileList />)
            },
        ]
    },
    {
        path: 'docList',
        children: DocListRoutes.map(route => ({
          ...route,
          element: SuspenseWrapper(React.createElement(route.element))
        }))
    },
    {
        path:'knowledgeBase',
        children: KnowledgeBaseRoutes.map(route => ({
          ...route,
          element: SuspenseWrapper(React.createElement(route.element))
        }))
    },
    // {
    //     path:'excelList',
    //     // children: KnowledgeBaseRoutes.map(route => ({
    //     //   ...route,
    //     element: SuspenseWrapper(<MemoExcelList />)
    // // )
    // },
    {
        path: 'excelList',
        element: SuspenseWrapper(<MemoExcelList />)
    },
    {
        path: 'excelList/excelDetail/:id',
        element: SuspenseWrapper(<MemoExcelDetail />)
    },
    {
        path: 'content',
        element: SuspenseWrapper(<MemoContent />)
    },
    {
        path: 'addContent/:folder',
        element: SuspenseWrapper(<MemoAddContent />)
    },
    {
        path: 'addExcel/:folder',
        element: SuspenseWrapper(<MemoAddExcel />)
    },
    {
        path: '*',
        element: SuspenseWrapper(<MemoNotFound />)
    }
])
export default router
